建模零代码之（树）列表的多级列头

01
背景介绍

在标准列表、标准树列表中，当列表的列数据内容为一类时，用户希望可以将这些列的列头放在一起并增加上层列头，更加清晰直观地展示数据结构。

02
典型场景

举个例子，在售楼系统的货值管理模块中，需要对货值数据按楼栋级数据进行分类，在货值树列表通过多层列头按照（全盘、已成交、已定价、未定价）对（套数、面积、均价、货值）做业务分类。

03
解决方案

在原有的建模系统中，这种业务场景只能通过后台定义API，返回动态列的方式来实现，效率非常低，后期也不好维护。现在用户通过建模后台进入列表、树列表控件设计器，在组件区域可以通过点击或拖拽的方式将「多级列头」添加到当前视图区域，然后将现有的普通列或者新的组件、字段，拖拽到多级列头区域，最后对列头字段的属性进行配置即可实现预期效果。这个过程只需要几分钟，无需投入开发资源，后续调整也非常便捷。

04
操作指南

1）新增树列表+表单页面，如图1所示：

图1 ：新增树列表+表单

2）编辑树列表页面下的树网格控件，点击或拖拽左侧组件区的多级列头，如图2所示：

图2：新增多级列头组件

3）通过拖拽方式，依次向多级列头组件中增加二级列字段，包括全盘套数、全盘面积、全盘均价和全盘贷款，修改字段标题时去掉“全盘”，如图3所示：

图3：多级列头增加字段

4）修改多级列头的一级列头标题为“全盘”，如图4所示：

图4：修改一级列头标题

5）重复上述操作，完成对售楼货值树列表页面的设计，如图5所示：

图5：售楼货值树树网格控件

6）继续对售楼货值表单页面进行设计，最终效果如图6所示：

图6：售楼货值页面运行效果

▼往期精彩回顾▼

▼更多技术分享可关注明源技术团队▼技术分享｜Java SDK 动态类型
技术分享｜给混合应用装上涡轮增压
技术分享｜文件预览方案在应用市场的落地